<div class="product-list_wrapper">
  <h2>Products</h2>

  <ul *ngFor="let product of products">
    <li>
      <a class="list-li_header" [routerLink]="['/products', product.id]" [title]="product.name + ' details'">
        {{ product.name }}
      </a>
      <p class="list-li_body" *ngIf="product.description">
        Description: {{ product.description }}
      </p>
      <p>
        <button (click)="share(product.name)">
          Share
        </button>
      </p>
      <app-product-alerts [product]="product" (emit)="onNotify(product.name)"></app-product-alerts>
    </li>
  </ul>
</div>